<template>
	<div class="search-com">
		<search :keyword="keyword" @setKeyword="setKeyword" @handleSearch="handleSearch"></search>
		<scroll>
			<selectCom :searchObj='searchObj' :typeInd="typeInd" :dolatInd="dolatInd" :fenbie="fenbie"
				:timeInd="timeInd" :vip="vip" @setParentData='setParentData' @handleSearch='handleSearch'></selectCom>
			<gridList :list='list'></gridList>

			<div class="btn" v-if="list.length" @click='handleLoadMore'>چېكىپ تېخىمۇ كۆپ كۆرمەك</div>
			<div class="emtpy" v-if="!list.length">
				<image src="/static/img/user/mezmun.jpg" class="img" mode="widthFix"></image>
			</div>
		</scroll>
	</div>
</template>

<script>
	import {
		getCategory,
		getSearch,
	} from '@/api/search.js'
	import search from '@/components/search/search.vue'
	import scroll from '@/components/search/scroll.vue'
	import selectCom from '@/components/search/select.vue'
	import gridList from '@/components/custom/gridList.vue'
	import {
		getOptions
	} from '@/scripts/compatible/pageOptions.js'
	import {
		log
	} from 'util'
	export default {
		components: {
			search,
			scroll,
			selectCom,
			gridList,
		},
		data() {
			return {
				searchObj: {},
				typeInd: '0',
				dolatInd: '0',
				fenbie: '0',
				timeInd: '0',
				vip: '0',
				list: [],
				page: 0,
				timeout: false,
				keyword: '',
			}
		},
		async mounted() {
			await this.getCategory()
			await this.options_init()
			await this.getList(true)
		},
		methods: {
			setParentData(obj) {
				for (let key in obj) {
					this[key] = obj[key]
				}
			},
			handleSearch() {
				this.getList(false)
			},
			async getList(isConcat) {
				const res = await getSearch(this)
				if (res) {
					// console.log(res);
					if (!res.data.data.data.data.length) {
						uni.showToast({
							title: 'تېخىمۇ كۆپ ئەمەس'
						})
					} else {
						if (isConcat) {
							this.list = this.list.concat(res.data.data.data.data)
						} else {
							this.list = res.data.data.data.data
						}
					}
					// console.log(this.list);
				}
			},
			setKeyword(keyword) {
				this.keyword = keyword
			},
			options_init() {
				const options = getOptions()
				this.fenbie = options.turid
				this.keyword = options.keyword || ''
				if (options.type == 'kino') {
					this.fenbie = options.id
					this.typeInd = 1
				}
				if (options.type == 'kisimlik') {
					this.fenbie = options.id
					this.typeInd = 2
				}
				if (options.type == 'sanat') {
					this.fenbie = options.id
					this.typeInd = 3
				}
				if (options.type == 'karton') {
					this.fenbie = options.id
					this.typeInd = 4
				}

				if (options.tur == 'baxbet') {
					if (options.typeInd == 1) {
						this.typeInd = 1
					}
					if (options.typeInd == 2) {
						this.typeInd = 2
					}
					if (options.typeInd == 3) {
						this.typeInd = 3
					}
					if (options.typeInd == 4) {
						this.typeInd = 4
					}
				}
			},
			handleLoadMore() {
				this.getList(true)
			},
			async getCategory() {
				const res = await getCategory()
				if (res) {
					this.searchObj = res.data.data
					// console.log(this.searchObj);
				}
			},
		},
	}
</script>

<style lang="scss" scoped>
	.search-com {
		.btn {
			width: max-content;
			height: 20px;
			line-height: 20px;
			margin: 0 auto;
			padding: 20px 0;
			color: #77c2fa;
		}

		.emtpy {
			padding: 20px;

			.img {
				display: block;
				width: 210px;
				margin: 0 auto;
			}
		}
	}
</style>